<template>
  <transition appear name="slide-up">
    <div class="result-page">
      <img class="result-img" :src="iconSrcTrue" alt="result" />
      <BeginButton :propsStyle="{ backgroundColor: '#198cf9', color: '#fff' }">
        已提交
      </BeginButton>
      <p class="self-score">得分：{{ score }}</p>
      <p style="margin-top: 60px">排行榜将在答题结束后展示</p>
    </div>
  </transition>
</template>

<script>
import Icon from 'vue-awesome/components/Icon';
import { mapState } from 'vuex';
import successIcon from '@/assets/icon/success.svg';
import failIcon from '@/assets/icon/fail.svg';
import BeginButton from '../BeginButton';

export default {
  name: 'ResultPage',
  components: {
    Icon,
    BeginButton,
  },
  props: {
    result: Boolean, // true代表成功，false代表失败
    title: String,
    text: String,
    score: {
      type: Number,
      required: true,
    },
  },
  computed: {
    iconSrc() {
      return this.result ? successIcon : failIcon;
    },
    iconSrcTrue() {
      return successIcon;
    },
    iconSrcFalse() {
      return failIcon;
    },
    ...mapState(['userId', 'gameNumber', 'practiceNumber', 'previousGameMode']),
  },
  methods: {
    play() {
      const type = this.previousGameMode;
      switch (type) {
        case 'normal':
          if (this.gameNumber[0] <= 0) {
            this.goHomeWithMessage('游戏次数不够，尝试填写邀请码吧！');
          }
          break;
        case 'practice':
          if (this.practiceNumber <= 0) {
            this.goHomeWithMessage('今日练习次数已用完，试试游戏模式吧！');
          }
          break;
        case 'activity':
          break;
        default:
      }
      // playGame({ openid: this.openid, type })
      //   .then((res) => {
      //     if (res.data.state) {
      //       this.commitPlayGame(type);
      //       this.$router.push('/countdown');
      //     } else {
      //       this.goHomeWithMessage(res.data.msg);
      //     }
      //   })
      //   .catch(() => {
      //     this.goHomeWithMessage('抱歉，暂时无法答题');
      //   });
    },
    goHomeWithMessage(message) {
      this.$router.push({ name: 'HomePage', params: { message } });
    },
    // ...mapMutations({
    //   commitPlayGame: PLAY_GAME
    // })
  },
};
</script>

<style lang="scss" scoped src="./style.scss"></style>
